<template>
	<view class="shop_address">
		<u-navbar title="收获地址管理" @rightClick="rightClick" :autoBack="true">
		</u-navbar>
		<view class="shop_main">
			<view class="shop_list" v-show="addFlat">
				<view class="shop_tab" v-for="(item,index) in userAddrList" :key="item._id">
					<view class="tab_left" :class="item.aflat? 'active':''" @click.passive="test(index)">
						W
					</view>
					<view class="tab_mid" @click.passive="test(index)">
						<view>{{item.aname}} {{item.aphone}}</view>
						<view>{{item.aaddr1}}{{item.aaddr2}}</view>
					</view>
					<view class="tab_right">
						<u-icon name="edit-pen" @click.passive="jumpUpdAddr(item._id)" color="gray"></u-icon>
					</view>

				</view>

			</view>
			<u-empty v-show="!addFlat" mode="address" icon="http://cdn.uviewui.com/uview/empty/car.png">
			</u-empty>
			<view class="add_addr">
				<view class="btn" @click="jumpAddAddr">
					+ 新增收获地址
				</view>
			</view>
		</view>
		<!-- <u-picker :show="show" ref="uPicker" :columns="columns" @confirm="confirm" @change="changeHandler"></u-picker> -->
	</view>
</template>

<script>
	export default {
		data() {
			return {
				// columns: [
				// 	[
				// 		"北京市",
				// 		"重庆市",
				// 		"福建省",
				// 		"江苏省",
				// 		"广东省",
				// 		"辽宁省",
				// 		"内蒙古",
				// 		"山西省",
				// 		"青海省",
				// 		"四川省",
				// 		"贵州省",
				// 		"云南省",
				// 		"陕西省",
				// 		"西藏",
				// 		"宁夏",
				// 		"新疆",
				// 		"广西",
				// 		"海南省",
				// 		"湖南省",
				// 		"湖北省",
				// 		"河南省",
				// 		"山东省",
				// 		"江西省",
				// 		"安徽省",
				// 		"浙江省",
				// 		"上海市",
				// 		"黑龙江省",
				// 		"吉林省",
				// 		"甘肃省",
				// 		"天津市",
				// 		"河北省",
				// 	],
				// 	["北京市"],
				// ],
				// columnData: [

				// 	["北京市"],


				// 	["重庆市"],
				// 	[
				// 		"漳州市",
				// 		"厦门市",
				// 		"三明市",
				// 		"泉州市",
				// 		"莆田市",
				// 		"宁德市",
				// 		"南平市",
				// 		"龙岩市",
				// 		"福州市"
				// 	],
				// 	[
				// 		"镇江市",
				// 		"张家港市",
				// 		"扬州市",
				// 		"盐城市",
				// 		"徐州市",
				// 		"宿迁市",
				// 		"无锡市",
				// 		"泰州市",
				// 		"苏州市",
				// 		"南通市",
				// 		"南京市",
				// 		"连云港市",
				// 		"淮安市",
				// 		"常州市",
				// 	],
				// 	[
				// 		"珠海市",
				// 		"中山市",
				// 		"肇庆市",
				// 		"湛江市",
				// 		"云浮市",
				// 		"阳江市",
				// 		"深圳市",
				// 		"韶关市",
				// 		"汕尾市",
				// 		"汕头市",
				// 		"清远市",
				// 		"梅州市",
				// 		"茂名市",
				// 		"揭阳市",
				// 		"江门市",
				// 		"惠州市",
				// 		"河源市",
				// 		"广州市",
				// 		"佛山市",
				// 		"东莞市",
				// 		"潮州市",
				// 	],
				// 	[
				// 		"营口市",
				// 		"铁岭市",
				// 		"沈阳市",
				// 		"盘锦市",
				// 		"辽阳市",
				// 		"锦州市",
				// 		"葫芦岛市",
				// 		"阜新市",
				// 		"抚顺市",
				// 		"丹东市",
				// 		"大连市",
				// 		"朝阳市",
				// 		"本溪市",
				// 		"鞍山市",
				// 	],
				// 	[
				// 		"兴安盟",
				// 		"锡林郭勒盟",
				// 		"乌兰察布市",
				// 		"乌海市",
				// 		"通辽市",
				// 		"呼伦贝尔市",
				// 		"呼和浩特市",
				// 		"鄂尔多斯市",
				// 		"赤峰市",
				// 		"包头市",
				// 		"巴彦淖尔市",
				// 		"阿拉善盟",
				// 	],
				// 	[
				// 		"长治市",
				// 		"运城市",
				// 		"阳泉市",
				// 		"忻州市",
				// 		"太原市",
				// 		"朔州市",
				// 		"吕梁市",
				// 		"临汾市",
				// 		"晋中市",
				// 		"晋城市",
				// 		"大同市",
				// 	],
				// 	[
				// 		"西宁市",
				// 		"海东市",
				// 		"海西蒙古族藏族自治州",
				// 	],
				// 	[
				// 		"自贡市",
				// 		"资阳市",
				// 		"宜宾市",
				// 		"雅安市",
				// 		"遂宁市",
				// 		"攀枝花市",
				// 		"内江市",
				// 		"南充市",
				// 		"绵阳市",
				// 		"眉山市",
				// 		"泸州市",
				// 		"凉山州",
				// 		"凉山彝族自治州",
				// 		"乐山市",
				// 		"广元市",
				// 		"广安市",
				// 		"甘孜藏族自治州",
				// 		"德阳市",
				// 		"达州市",
				// 		"成都市",
				// 		"巴中市",
				// 		"阿坝藏族羌族自治州",
				// 	],
				// 	[
				// 		"贵阳市",
				// 		"遵义市",
				// 		"铜仁市",
				// 		"黔西南布依族苗族自治州",
				// 		"黔南布依族苗族自治州",
				// 		"黔东南苗族侗族自治州",
				// 		"六盘水市",
				// 		"毕节市",
				// 		"安顺市",
				// 	],
				// 	[
				// 		"昭通市",
				// 		"玉溪市",
				// 		"西双版纳傣族自治州",
				// 		"文山壮族苗族自治州",
				// 		"曲靖市",
				// 		"普洱市",
				// 		"临沧市",
				// 		"丽江市",
				// 		"昆明市",
				// 		"红河哈尼族彝族自治州",
				// 		"德宏傣族景颇族自治州",
				// 		"大理白族自治州",
				// 		"楚雄彝族自治州",
				// 		"保山市",
				// 	],
				// 	[
				// 		"榆林市",
				// 		"延安市",
				// 		"咸阳市",
				// 		"西安市",
				// 		"渭南市",
				// 		"铜川市",
				// 		"商洛市",
				// 		"汉中市",
				// 		"宝鸡市",
				// 		"安康市",
				// 	],
				// 	[
				// 		"咸阳市",
				// 		"拉萨市",
				// 	],
				// 	[
				// 		"银川市",
				// 		"吴忠市",
				// 		"石嘴山市",
				// 		"固原市",
				// 	],
				// 	[
				// 		"乌鲁木齐市",
				// 		"阿拉尔市",
				// 		"伊犁哈萨克自治州",
				// 		"五家渠市",
				// 		"吐鲁番市",
				// 		"石河子市",
				// 		"克拉玛依市",
				// 		"喀什地区",
				// 		"和田地区",
				// 		"哈密市",
				// 		"昌吉回族自治州",
				// 		"巴音郭楞蒙古自治州",
				// 		"阿克苏地区",
				// 	],
				// 	[
				// 		"玉林市",
				// 		"梧州市",
				// 		"钦州市",
				// 		"南宁市",
				// 		"柳州市",
				// 		"来宾市",
				// 		"贺州市",
				// 		"河池市",
				// 		"桂林市",
				// 		"崇左市",
				// 		"北海市",
				// 		"百色市",
				// 	],
				// 	[
				// 		"文昌市",
				// 		"三亚市",
				// 		"琼海市",
				// 		"海口市",
				// 	],
				// 	[
				// 		"株洲市",
				// 		"长沙市",
				// 		"张家界市",
				// 		"岳阳市",
				// 		"永州市",
				// 		"益阳市",
				// 		"湘西土家族苗族自治州",
				// 		"湘潭市",
				// 		"邵阳市",
				// 		"娄底市",
				// 		"怀化市",
				// 		"衡阳市",
				// 		"郴州市",
				// 		"常德市",
				// 	],
				// 	[
				// 		"宜昌市",
				// 		"孝感市",
				// 		"襄阳市",
				// 		"咸宁市",
				// 		"仙桃市",
				// 		"武汉市",
				// 		"天门市",
				// 		"随州市",
				// 		"十堰市",
				// 		"潜江市",
				// 		"荆州市",
				// 		"荆门市",
				// 		"黄石市",
				// 		"黄冈市",
				// 		"恩施土家族苗族自治州",
				// 		"鄂州市",
				// 	],
				// 	[
				// 		"驻马店市",
				// 		"周口市",
				// 		"郑州市",
				// 		"许昌市",
				// 		"信阳市",
				// 		"新乡市",
				// 		"商丘市",
				// 		"三门峡市",
				// 		"濮阳市",
				// 		"平顶山市",
				// 		"南阳市",
				// 		"漯河市",
				// 		"洛阳市",
				// 		"开封市",
				// 		"焦作市",
				// 		"济源市",
				// 		"鹤壁市",
				// 		"安阳市",
				// 	],
				// 	[
				// 		"淄博市",
				// 		"枣庄市",
				// 		"烟台市",
				// 		"潍坊市",
				// 		"威海市",
				// 		"泰安市",
				// 		"日照市",
				// 		"青岛市",
				// 		"临沂市",
				// 		"聊城市",
				// 		"莱芜市",
				// 		"济宁市",
				// 		"济南市",
				// 		"菏泽市",
				// 		"东营市",
				// 		"德州市",
				// 		"滨州市",
				// 	],
				// 	[
				// 		"鹰潭市",
				// 		"宜春市",
				// 		"新余市",
				// 		"上饶市",
				// 		"萍乡市",
				// 		"南昌市",
				// 		"九江市",
				// 		"景德镇市",
				// 		"吉安市",
				// 		"赣州市",
				// 		"抚州市",
				// 	],
				// 	[
				// 		"宣城市",
				// 		"宿州市",
				// 		"芜湖市",
				// 		"铜陵市",
				// 		"马鞍山市",
				// 		"六安市",
				// 		"黄山市",
				// 		"淮南市",
				// 		"淮北市",
				// 		"合肥市",
				// 		"阜阳市",
				// 		"滁州市",
				// 		"池州市",
				// 		"亳州市",
				// 		"蚌埠市",
				// 		"安庆市",
				// 	],
				// 	[
				// 		"舟山市",
				// 		"温州市",
				// 		"台州市",
				// 		"绍兴市",
				// 		"衢州市",
				// 		"宁波市",
				// 		"丽水市",
				// 		"金华市",
				// 		"嘉兴市",
				// 		"湖州市",
				// 		"杭州市",
				// 	],
				// 	[
				// 		"上海市"
				// 	],
				// 	[
				// 		"伊春市",
				// 		"绥化市",
				// 		"双鸭山市",
				// 		"齐齐哈尔市",
				// 		"七台河市",
				// 		"牡丹江市",
				// 		"佳木斯市",
				// 		"鸡西市",
				// 		"黑河市",
				// 		"鹤岗市",
				// 		"哈尔滨市",
				// 		"大兴安岭地区",
				// 		"大庆市"
				// 	],
				// 	[
				// 		"长春市",
				// 		"延边朝鲜族自治州",
				// 		"通化市",
				// 		"松原市",
				// 		"四平市",
				// 		"辽源市",
				// 		"吉林市",
				// 		"白山市",
				// 		"白城市"
				// 	],
				// 	[
				// 		"张掖市",
				// 		"武威市",
				// 		"天水市",
				// 		"庆阳市",
				// 		"平凉市",
				// 		"陇南市",
				// 		"临夏州",
				// 		"兰州市",
				// 		"酒泉市",
				// 		"金昌市",
				// 		"嘉峪关市",
				// 		"甘南藏族自治州",
				// 		"定西市",
				// 		"白银市",
				// 	],

				// 	[
				// 		"天津市"
				// 	],
				// 	[
				// 		"张家口市",
				// 		"邢台市",
				// 		"唐山市",
				// 		"石家庄市",
				// 		"秦皇岛市",
				// 		"廊坊市",
				// 		"衡水市",
				// 		"邯郸市",
				// 		"承德市",
				// 		"沧州市",
				// 		"保定市"
				// 	],
				// ],

				userAddrList: [],
				addFlat: false
			};
		},
		onShow() {
			uniCloud.callFunction({
				name: "user_addrs",
				data: {
					uid: uni.getStorageSync("_id")
				}
			}).then((res) => {
				console.log(res, " 1.1")
				this.userAddrList = res.result.data
				if (this.userAddrList == 0) {
					this.addFlat = false
				} else {
					this.addFlat = true
				}
			})
			console.log(123)
		},
		methods: {
			test(x) {
				console.log(x)
				uni.setStorageSync("a_id", x)
				uni.navigateBack({
					delta: 1
				})
			},
			rightClick() {
				console.log('rightClick');
			},
			leftClick() {
				console.log('leftClick');
			},
			jumpUpdAddr(x) {
				console.log("jumpUpdAddr", x)
				uni.navigateTo({
					url: `/pages/update_addr/update_addr?aid=${x}`
				})

			},
			jumpAddAddr() {
				uni.navigateTo({
					url: "/pages/add_addr/add_addr"
				})
			}
			// changeHandler(e) {
			// 	const {
			// 		columnIndex,
			// 		value,
			// 		values, // values为当前变化列的数组内容
			// 		index,
			// 		// 微信小程序无法将picker实例传出来，只能通过ref操作
			// 		picker = this.$refs.uPicker
			// 	} = e
			// 	// 当第一列值发生变化时，变化第二列(后一列)对应的选项
			// 	if (columnIndex === 0) {
			// 		// picker为选择器this实例，变化第二列对应的选项
			// 		picker.setColumnValues(1, this.columnData[index])
			// 	}
			// },
			// // 回调参数为包含columnIndex、value、values
			// confirm(e) {
			// 	console.log('confirm', e.value)
			// 	this.show = false
			// 	if (e.value[0] == e.value[1]) {
			// 		this.obj.addr = e.value[0]
			// 	} else {
			// 		this.obj.addr = e.value[0] + e.value[1]
			// 	}
			// },

		}
	}
</script>

<style lang="scss">
	.add_addr {
		position: fixed;
		bottom: 0;
		left: 0;
		height: 60px;
		background-color: white;
		width: 100%;

		.btn {
			margin: 8px 10px;
			height: 44px;
			background-color: whitesmoke;
			background: linear-gradient(to left, #ff78a2, #ffa5a5);
			border-radius: 22px;
			text-align: center;
			line-height: 44px;
			color: white;
		}
	}

	.shop_address {
		position: relative;
		background-color: #f3f2f2;
		min-height: 100vh;
		padding-bottom: 70px;
		color: #333;

		.shop_main {
			padding-top: 10px;
			margin: 55px 10px 0;
			background-color: white;
			border-radius: 12px;
			padding-bottom: 10px;

			.shop_tab {
				margin: 0 10px 10px;
				height: 62px;
				border-radius: 10px;
				display: flex;
				align-items: center;

				&:last-child {
					margin-bottom: 0;
				}

				.tab_left {
					height: 45px;
					width: 45px;
					background-color: navajowhite;
					text-align: center;
					line-height: 45px;
					border-radius: 50%;
					background-color: white;
					color: #ffa2ab;
					box-sizing: border-box;
					border: 2px solid #ffa2ab;
					// box-shadow: -2px 2px 4px #ffa2ab,
					// 	inset -2px -2px 4px white,
					// ;

					&.active {
						color: white;
						background-color: #ffa2ab;
						// box-shadow: -2px 2px 4px #ffa2ab,
						// 	inset -2px -2px 4px white,
						// ;
						// border: none;
					}
				}

				.tab_mid {
					width: 240px;
					height: 55px;
					margin: 0 10px;
					display: flex;
					flex-direction: column;
					justify-content: space-around;

					view {
						overflow: hidden;
						text-overflow: ellipsis;
						white-space: nowrap;
						font-size: 13px;

						&:first-child {
							font-size: 15px;
						}

						&:last-child {
							color: gray;
						}
					}
				}

				.tab_right {
					width: 20px;
					display: flex;
					justify-content: center;
					margin-top: 4px;

				}
			}
		}
	}
</style>